<!--
 * @Descripttion: 
 * @Author: voanit
 * @Date: 2022-06-29 09:04:23
 * @LastEditors: voanit
 * @LastEditTime: 2022-06-29 15:33:41
-->

<template>
  <div>
    御剑乘风来,除魔天地间!toRefs==={{ obj.age }}==={{ age }}=={{ name }}
    <button @click="btn">按钮</button>
  </div>
</template>
<script>
import { reactive, toRef, toRefs } from 'vue'
export default {
  name: 'BackCom',
  setup () {
    const obj = reactive({
      age: 18,
      name: 'rose',
      gender: 1
    })
    // const age = toRef(obj,'age')
    const newObj = toRefs(obj)
    // console.log(newObj, 77);

    const btn = () => {
      newObj.age.value += 5
      newObj.name.value = 'jack'
    }

    return { obj, btn, ...newObj }
  }

}
</script>
<style lang='less'  scoped>
</style>